Skip to content

fix: table view edit/delete without PK, toolbar icons, 9 database actions - #116

Merged
Blankll merged 10 commits into
masterfrom
feat/table-view-actions-fixes
Jun 30, 2026
Merged

fix: table view edit/delete without PK, toolbar icons, 9 database actions#116
Blankll merged 10 commits into
masterfrom
feat/table-view-actions-fixes

Conversation

@Blankll

@Blankll Blankll commented Jun 25, 2026

Copy link
Copy Markdown
Member

Summary

Three related fixes: (1) table view edit/delete now works on tables without primary key detection by falling back to all-column identification, (2) editor toolbar icons fixed and recolored for visibility, (3) all 9 database CRUD actions now implemented instead of showing 'not implemented' toast.

Changes

DataTableView — Edit/Delete Without Primary Key

  • extractPkValues() falls back to ALL columns when no PK detected — edit/delete no longer blocked
  • Row selection, select-all, batch delete always visible regardless of PK detection
  • Edit button colored blue, Delete button colored rose (was invisible text-foreground)
  • No primary key → warning toast with description, operation proceeds using all columns as WHERE clause

Editor Toolbar — Fixed Icons & Visibility

  • Explain icon fixed: i-carbon-wand (non-existent) → i-carbon-diagram (valid, now renders)
  • Each toolbar button gets a distinct color with dark mode variants:
    • Execute (Play) = text-green-600 dark:text-green-400
    • Explain (Diagram) = amber base, emerald when in analyze mode
    • Analyze toggle = purple active state
    • Format = text-blue-600 dark:text-blue-400
    • Save As = neutral text-muted-foreground
  • Save As button resized from h-7 w-7 to h-9 w-9 (matches other buttons)
  • Hover state upgraded: hover:bg-mutedhover:bg-accent
  • disabled:opacity-40 for disabled state

Database Actions — 9 CRUD Actions Implemented

Action Component Behavior
New Database CreateObjectDialog.vue Enter name → CREATE DATABASE → refresh tree
New Schema CreateObjectDialog.vue Enter name → CREATE SCHEMA → refresh tree
Drop Database DropDatabaseDialog.vue Type name to confirm → DROP DATABASE
New Table CreateTableDialog.vue Visual table designer with column grid, type selector, SQL preview → opens generated SQL in editor
New View Opens editor tab with CREATE VIEW template
New Function Opens editor tab with CREATE FUNCTION template
New Procedure Opens editor tab with CREATE PROCEDURE template
Backup Navigates to /transfer page
Export Navigates to /transfer page

Files Changed

File Change
src/components/sidebar/CreateObjectDialog.vue NEW — reusable name-input dialog
src/components/sidebar/CreateTableDialog.vue NEW — table designer with column grid
src/components/sidebar/DropDatabaseDialog.vue NEW — destructive confirm dialog
src/components/sidebar/index.ts Export new dialog components
src/pages/QueriesPage.vue 9 action handlers + toolbar icon/color fixes + dialogs wired
src/components/database-browser/DataTableView.vue Edit/delete without PK fallback + action button colors
src/lang/enUS.ts i18n strings for all new features
src/lang/zhCN.ts Chinese translations

Blankll added 10 commits June 26, 2026 01:40
…ase actions

- DataTableView: edit/delete now works on tables without primary key detection
  Falls back to using all columns as WHERE clause (DBeaver style)
  Row selection, batch delete, select-all always visible regardless of PK
  Edit/delete row action buttons now have distinct colors (blue/rose)
- Editor toolbar: fixed explain icon (carbon-wand was broken, now carbon-diagram)
  Each toolbar button has distinct color (green/amber/violet/blue)
  Save As button resized to match other buttons (h-9 w-9)
  Hover state upgraded from hover:bg-muted to hover:bg-accent
- Database actions: 9 CRUD actions implemented (newDatabase, newSchema,
  newTable, newView, newFunction, newProcedure, dropDatabase, backup, export)
  CreateObjectDialog, CreateTableDialog, DropDatabaseDialog components
  All wired to QueriesPage.vue with proper error handling
  SQL templates for VIEW/FUNCTION/PROCEDURE open in editor
  Backup/export navigate to /transfer page
- i18n: enUS + zhCN strings for all new features
COLUMN_KEY extraction used index 7 (row.get_opt(7)) which silently fails
in mysql_async 0.34 due to column ordering quirk. Switched to name-based
access row.get_opt("COLUMN_KEY") which is more robust.

Also added: console diagnostics in DataTableView when PK detection fails,
so users can see what list_columns returns for debugging.

The existing fallback (edit/delete using all columns when no PK detected)
is kept as safety net for adapters like HttpSql that don't support
list_columns at all.
…N_KEY

INFORMATION_SCHEMA.COLUMNS.COLUMN_KEY relies on mysql_async's
FromValue<String> conversion which can fail silently depending on
the MySQL server's charset/collation settings for the INFORMATION_SCHEMA
virtual tables, causing PKs to never be detected.

Fix: query KEY_COLUMN_USAGE with CONSTRAINT_NAME = 'PRIMARY' in a
separate query to build a HashSet of PK column names, then check
each column against it. This is the same approach DBeaver uses
via JDBC's DatabaseMetaData.getPrimaryKeys().
…tness

mysql_async's FromValue<String> can silently fail on INFORMATION_SCHEMA
virtual table columns because they use a different character set than
user tables. This caused COLUMN_KEY to always read as empty string,
making PK detection fail for ALL MySQL tables.

Fix: add get_str() / get_str_by_name() / get_opt_str() helpers that try
FromValue<String> first, then fall back to FromValue<Vec<u8>> +
String::from_utf8_lossy(). This ensures string column values are
always correctly decoded regardless of charset quirks.

Applied to all string column reads in list_columns (COLUMN_NAME,
DATA_TYPE, IS_NULLABLE, COLUMN_DEFAULT, COLUMN_KEY, EXTRA, COLUMN_COMMENT).
- CreateDatabaseDialog: MySQL gets charset dropdown + collation input;
  PostgreSQL gets encoding dropdown + locale input; other DBs get
  name-only (same as before)
- CreateTableDialog: MySQL gets ENGINE dropdown (InnoDB/MyISAM/MEMORY/...)
- CreateObjectDialog kept for Create Schema (no extra options needed)
- i18n: enUS + zhCN for all new fields
- QueriesPage passes activeConnection.type to dialogs for type-aware UI
- Sidebar index exports CreateDatabaseDialog
ApiResponse is a tagged enum ({"status":"success"|"error"}) not a
struct with a boolean success field. The old check `result.success ===
false` was always false (field didn't exist), so ALL backend errors
were silently swallowed — including failed CREATE DATABASE.

Fix: use `isApiSuccess(result)` which checks `result.status ===
'success'` correctly.

Also: replace schemaTreeRef.refresh() with direct fetchDatabases()
after create/drop database, so the tree doesn't switch to Mode A.
Each database type has different identifier quoting:
- MySQL-compat: backticks ()
- PostgreSQL-compat: double quotes ("name")
- SQL Server: square brackets ([name])
- Others: unquoted

Also only appends options relevant to the database type
(CHARACTER SET/COLLATE for MySQL, ENCODING/LC_COLLATE for PG).
@Blankll
Blankll merged commit f54625c into master Jun 30, 2026
3 checks passed
@Blankll
Blankll deleted the feat/table-view-actions-fixes branch June 30, 2026 08:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant